import { history } from 'umi';
import { Menu } from 'antd';
const { SubMenu } = Menu;
import { BarChartOutlined, ContactsOutlined, FileAddOutlined, SettingOutlined } from '@ant-design/icons';

const icons = (id) => {
    switch (id) {
        case 0:
            return <BarChartOutlined />
        case 1:
            return <ContactsOutlined />
        case 2:
            return <FileAddOutlined />
        case 3:
            return <SettingOutlined />
        default:
            return null
    }
}

export default (props) => {
    const { routes } = props;

    // 归类routes
    var list = routes,
        flag = 0,
        data = [];
    for (var i = 0; i < list.length; i++) {
        if (list[i].hasOwnProperty("title")) {
            var az = '';
            for (var j = 0; j < data.length; j++) {
                if (data[j][0].class == list[i].class) {
                    flag = 1;
                    az = j;
                    break;
                }
            }
            if (flag == 1) {
                data[az].push(list[i]);
                flag = 0;
            } else if (flag == 0) {
                let wdy = new Array();
                wdy.push(list[i]);
                data.push(wdy);
            }
        }
    }

    return (
        <Menu
            theme="dark"
            defaultSelectedKeys={['0-0']}
            defaultOpenKeys={['1', '2', '3']}
            mode="inline"
            style={{height:'100%'}}
        >
            {data.map((item, id) =>
                item.length !== 1 ?
                    <SubMenu key={`${id}`} icon={icons(id)} title={item[0].class}>
                        {item.map((sitem, sid) =>
                            <Menu.Item key={`${id}-${sid}`} onClick={() => history.push(sitem.path)}>
                                {sitem.title}
                            </Menu.Item>
                        )}
                    </SubMenu>
                    :
                    <Menu.Item key={`${id}-0`} icon={icons(id)} onClick={() => history.push(item[0].path)}>
                        {item[0].title}
                    </Menu.Item>
            )}
        </Menu>
    )
}